<% content_for(:title) { @page.name } %>

<% content_for(:main_menu_style) { 'collapsed-menu' } %>

<% content_for(:alchemy_body_class) { 'elements-window-visible' } %>

<% content_for(:toolbar) do %>
<div class="toolbar_buttons">
  <div class="toolbar_button">
    <sl-tooltip content="<%= Alchemy.t(:explain_unlocking) %>" placement="top-start">
      <%= form_tag alchemy.unlock_admin_page_path(@page, redirect_to: @layoutpage ? alchemy.admin_layoutpages_path : alchemy.admin_pages_path), id: 'unlock_page_form' do %>
        <button class="icon_button" data-alchemy-hotkey="alt+x">
          <%= render_icon('expand-left') %>
        </button>
      <% end %>
    </sl-tooltip>
  </div>
  <div class="toolbar_spacer"></div>
  <div class="toolbar_button">
    <sl-tooltip content="<%= Alchemy.t(:page_infos) %>">
      <%= link_to_dialog(
        render_icon(:information),
        alchemy.info_admin_page_path(@page),
        {
          title: Alchemy.t(:page_infos),
          size: '520x320'
        },
        {
          class: 'icon_button',
          'data-alchemy-hotkey' => 'alt+i'
        }
      ) %>
    </sl-tooltip>
  </div>
  <div class="toolbar_button">
    <sl-tooltip content="<%= Alchemy.t(:edit_page_properties) %>">
      <% if @page.layoutpage? %>
        <%= link_to_dialog(
          render_icon("settings-3"),
          alchemy.edit_admin_layoutpage_path(@page),
          {
            title: Alchemy.t(:page_properties),
            size: '500x170'
          },
          class: :icon_button,
          'data-alchemy-hotkey' => 'alt+e'
        ) %>
      <% else %>
        <%= link_to_dialog(
          render_icon("settings-3"),
          alchemy.configure_admin_page_path(@page),
          {
            title: Alchemy.t(:page_properties),
            size: '500x680'
          },
          class: :icon_button,
          'data-alchemy-hotkey' => 'alt+e'
        ) %>
      <% end %>
    </sl-tooltip>
  </div>
  <div class="toolbar_button">
    <%= content_tag "sl-tooltip", content: @page.language.public? ? Alchemy.t(:explain_publishing) : @page.editable_by?(current_alchemy_user) ? Alchemy.t(:publish_page_language_not_public) : Alchemy.t(:publish_page_not_allowed) do %>
      <%= form_tag alchemy.publish_admin_page_path(@page), id: 'publish_page_form' do %>
        <%= button_tag class: 'icon_button please_wait', disabled: cannot?(:publish, @page) do %>
          <%= render_icon('upload-cloud-2') %>
        <% end %>
      <% end %>
    <% end %>
  </div>
  <% unless @page.layoutpage? %>
    <div class="toolbar_button">
      <% if @page.public? %>
        <sl-tooltip content="<%= Alchemy.t("Visit page") %>">
          <%= link_to show_page_url(
              urlname: @page.urlname,
              locale: prefix_locale? ? @page.language_code : nil,
              host: @page.site.host == "*" ? request.host : @page.site.host,
            ),
            data: { turbo: false },
            target: "_blank",
            class: 'icon_button' do %>
            <%= render_icon('external-link') %>
          <% end %>
        </sl-tooltip>
      <% else %>
        <sl-tooltip content="<%= Alchemy.t(:cannot_visit_unpublic_page) %>">
          <%= content_tag "a", class: "disabled icon_button" do %>
            <%= render_icon('external-link') %>
          <% end %>
        </sl-tooltip>
      <% end %>
    </div>
  <% end %>
  <div class="toolbar_spacer"></div>
  <div class="select_with_label">
    <sl-tooltip content="<%= Alchemy.t(:preview_size) %>" placement="top-start">
      <%= render_icon(:computer) %>
      <%= select_tag "preview_size",
        options_for_select(preview_sizes_for_select),
        include_blank: Alchemy.t("auto", scope: "preview_sizes") %>
    </sl-tooltip>
  </div>
  <div class="toolbar_spacer"></div>
  <% if @preview_urls.many? %>
    <div class="select_with_label">
      <label><%= Alchemy.t(:preview_url) %></label>
      <%= select_tag 'preview_url',
        options_for_select(@preview_urls),
        class: 'large' %>
    </div>
  <% end %>
  <div class="toolbar_button">
    <sl-tooltip content="<%= Alchemy.t('Reload Preview') %>">
      <%= link_to render_icon(:refresh), nil, {
        class: 'icon_button',
        id: 'reload_preview_button'
      } %>
    </sl-tooltip>
  </div>
</div>
<div class="toolbar_buttons right">
  <div class="toolbar_button">
    <sl-tooltip content="<%= Alchemy.t(:hide_elements) %>">
      <%= link_to render_icon("menu-unfold"), nil, {
        id: "element_window_button",
        class: "icon_button"
      } %>
    </sl-tooltip>
  </div>
</div>
<% end %>

<iframe
  url="<%= @preview_url %>"
  id="alchemy_preview_window"
  name="alchemy_preview_window"
  is="alchemy-preview-window"
  frameborder="0">
</iframe>

<%= turbo_frame_tag "alchemy_elements_window", src: alchemy.admin_elements_path(page_version_id: @page_version.id) do %>
  <alchemy-spinner></alchemy-spinner>
<% end %>

<% content_for :javascripts do %>
<script type="module">
  $(document).one('turbo:load', function() {
    $('#unlock_page_form, #publish_page_form').on('submit', function(event) {
      var not_dirty = Alchemy.checkPageDirtyness(this);
      if (!not_dirty) Alchemy.pleaseWaitOverlay(false);
      return not_dirty;
    });
    Alchemy.PageLeaveObserver();
  });

</script>
<% end %>
